<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- <style>@import url("../assets/css/view.css");</style>
    <style>@import url("../assets/css/layui.css");</style> -->
    <link href="../assets/css/layui.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="../assets/css/view.css"/>
    <script src="../vue.min.js"></script>
    <script src="../axios.min.js"></script>
    <title></title>
</head>
<body class="layui-view-body">
<div id="link">
    <div class="layui-content">
        <div class="layui-row">
            <div class="layui-card">
                <div class="layui-card-header">添加链接</div>


                <div class="layui-form-item">
                    <label class="layui-form-label">ip: </label>
                    <div class="layui-input-block">
                        <input type="text" v-model="Dblink.ip"> <br>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">选择数据库类型</label>
                    <div class="layui-input-block">
                        <select v-model="Dblink.dbType" lay-verify="required">
                            <option value="0">请选择</option>
                            <option v-for="u in databaseList" :value="u.id">{{u.typeName}}</option>
                        </select>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">端口号: </label>
                    <div class="layui-input-block">
                        <input type="text" v-model="Dblink.port"> <br>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">数据库用户名: </label>
                    <div class="layui-input-block">
                        <input type="text" v-model="Dblink.username"> <br>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">密码: </label>
                    <div class="layui-input-block">
                        <input type="password" v-model="Dblink.password"> <br>
                    </div>
                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">链接名: </label>
                    <div class="layui-input-block">
                        <input type="text" v-model="Dblink.linkName"> <br>
                    </div>
                </div>


                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn layui-btn-blue" @click="commitTask()">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>


            </div>
        </div>
    </div>
</div>
<!-- <script src="../assets/layui.all.js"></script> -->
<!-- <script>
  var form = layui.form
    ,layer = layui.layer;
</script> -->
<script>
    new Vue({
        el: "#link",
        data: {

            databaseList: [],

            Dblink: {
                dbType: "0",
                ip: "",
                port: "",
                linkName: "",
                username: "",
                password: ""
            }

        },
        created() {
            this.getData();
        },
        methods: {
            getData: function () {//获取源数据库类型
                var Authorization = localStorage.getItem('Authorization');

                axios.get("http://localhost:9005/admin/adminController/getAllDatabaseType", {headers: {'Authorization': Authorization}}).then(response => {
                    this.databaseList = response.data.data;
                }).catch(function (error) {
                  if (5102 == error.response.status) {

                      alert("无权限");
                      location.href="wuquan.html";
                      
                  }
              })
            },


            commitTask: function () {//添加任务
                var Authorization = localStorage.getItem('Authorization');

                // console.log(this.Dblink);
                axios.post("http://localhost:9005/admin/adminController/addDatabaseLink", this.Dblink, {headers: {'Authorization': Authorization}}).then(response => {
                    alert(response.data.message);
                    location.href = "shujukulianjie.html";
                }).catch(function (error) {
                    alert("发生异常" + error);
                })
            },


        }
    })
</script>
</body>
</html>